<template>
  <div class="content-box">
    <div class="content" v-for="(item, index) in ContentList1" :key="index">
      <img :src="item.titlepic" alt="">
      <div class="content1">
        <p class="p1">#{{ item.title }}#</p>
        <p class="p2">{{ item.desc }}</p>
        <p class="p2"><span style="margin-right: 5px;">动态：{{ item.post_count }}</span>今日：{{ item.todaypost_count
        }}</p>
      </div>
    </div>
  </div>
</template>

<script>
export default {
  props: {
    ContentList1: {
      type: Array,
    }
  }
}
</script>

<style lang="scss" scoped>
$width: 100%;

.content-box {
  .content {
    width: $width;
    height: 104.5px;
    margin: 10px 0;
    display: flex;

    img {
      width: 75px;
      height: 75px;
      margin: auto 0;
    }

    .content1 {
      margin: auto 0;
      margin-left: 10px;
      display: flex;
      flex-direction: column;

      .p1 {
        font-size: 17px;
      }

      .p2 {
        font-size: 15px;
        color: #6c757d;
      }
    }
  }
}
</style>